<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <div id="test"><span>我是⼀个div</span></div>
    <div id="test2"><span>我是另外一个div</span></div>
    <input type="text" id="username" value="张三丰">
    <!-- <button id="button">点击我</button> -->
    <input type="button" value="点击我有惊喜" id="button">
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script>
        $("#button").click(function(){
            let text = $("#test").text("<h1>我是test方法</h1>");
            console.log(text);

            let html = $("#test2").html("<h1>我是html方法</h1>");
            console.log(html);

            let val = $("#username").val("我是val方法");
            console.log(val);
        });

        // $("button").click(
        //     function(){
        //         $(this).hide();
        //     }
        // );

        // $(document).ready(function(){
        //     $("#button").click(
        //         function(){
        //             this.hide();
        //         }
        //     );
        // });
    </script>
</body>

</html>